JS - array methoden - muterend

Bronnen

Loren Stewart, JavaScript Array Methods: Mutating vs. Non-Mutating, Jan 22 2017

sort

var namen = ['Jef', 'Anna', 'Liestbeth', 'Gilles', 'Lynn', 'Denis'];
namen;
[
   0: "Jef",
   1: "Anna",
   2: "Liestbeth",
   3: "Gilles",
   4: "Lynn",
   5: "Denis",
   length: 6
]

namen.sort();
namen;
[
   0: "Anna",
   1: "Denis",
   2: "Gilles",
   3: "Jef",
   4: "Liestbeth",
   5: "Lynn",
   length: 6
]

Dat kan je ook met getallen doen:

var getallen = [102, 8, 78, 5, 4, 65];
getallen;
[
   0: 102,
   1: 8,
   2: 78,
   3: 5,
   4: 4,
   5: 65,
   length: 6
]

getallen.sort();
getallen;
[
   0: 102,
   1: 4,
   2: 5,
   3: 65,
   4: 78,
   5: 8,
   length: 6
]

Sommige getallen zijn wel degelijk van plaats veranderd maar de lijst in niet in de juiste numerieke volgorde. Dat komt om JavaScript sort() functie de getallen als tekenreeksen ordent.

Om de juiste numerieke volgorde te hebben, moet je een sort functie als argument meegeven.

Om de lijst in dalende volgorde de ordenen:

getallen.sort(function(a,b){return b-a});

getallen;
[
   0: 102,
   1: 78,
   2: 65,
   3: 8,
   4: 5,
   5: 4,
   length: 6
]

Om de lijst in stijgende volgorde te ordenen:

getallen.sort(function(a,b){return a-b});
getallen;
[
   0: 4,
   1: 5,
   2: 8,
   3: 65,
   4: 78,
   5: 102,
   length: 6
]

join

Om alle elementen in een array in één tekenreeks aan elkaar te plakken gebruik je methode join. Als argument kan je een tekenreeks meegeven die tussen de waarden van de elementen geplaatst moet worden. In het voorbeeld gebruiken we de arrays van hierboven:

namen.join(' en ') + ' doen mee.';
"Anna en Denis en Gilles en Jef en Liestbeth en Lynn doen mee."

Dat werkt ook met getallen:

getallen.join(' en ');
"4 en 5 en 8 en 65 en 78 en 102"

splice

De splice methode doet hetzelfde als de splice methode maar er zijn twee verschillen:

• het tweede argument geeft aan hoeveel elementen je websnijdt;
• verwijdert het stuk dat je uit de array snijdt;

Een voorbeeld moet dat duidelijk maken:

var getallen = [102, 8, 78, 5, 4, 65];
var stuk = getallen.splice(1, 2);
stuk;
[
   0: 8,
   1: 78,
   length: 2
]

Je optioneel het weggesneden stuk vervangen door nieuwe waarden als argument achter het start argument en het aantal element argument:

var getallen = [102, 8, 78, 5, 4, 65];
var stuk = getallen.splice(1, 2, 'ter vervanging van 8', 'ter vervanging van 78');
stuk;
[
   0: 8,
   1: 78,
   length: 2
]
getallen;
[
   0: 102,
   1: "ter vervanging van 8",
   2: "ter vervanging van 78",
   3: 5,
   4: 4,
   5: 65,
   length: 6
]

push

Met de push methode kan je element aan het einde van een array toevoegen. De push methode retourneert het aantal elementen die na de push in de array zitten:

var getallen = [102, 8, 78, 5, 4, 65];
getallen.push(100000);
7
getallen;
[
   0: 102,
   1: 8,
   2: 78,
   3: 5,
   4: 4,
   5: 65,
   6: 100000,
   length: 7
]

Je kan meer dan een element aan het einde van de array toevoegen door meerdere waarden als argument mee te geven:

getallen.push(10, 100);
9
getallen;
[
   0: 102,
   1: 8,
   2: 78,
   3: 5,
   4: 4,
   5: 65,
   6: 100000,
   7: 10,
   8: 100,
   length: 9
]

unshift

Voegt een element toe aan het begin van de array:

getallen.unshift(2000000);
getallen;
Array [ 200000, 102, 8, 78, 5, 4, 65 ]

pop

Met de pop methode kan je het laatste element uit een array halen. De pop methode retourneert dit weggehaalde element:

var laatste = getallen.pop();
laatste;
100
getallen;
[
   0: 102,
   1: 8,
   2: 78,
   3: 5,
   4: 4,
   5: 65,
   6: 100000,
   7: 10,
   length: 8
]

shift

Met de shift methode verwijder je het eerste element uit de array. De shift methode retourneert dit weggehaalde element:

var getallen = [102, 8, 78, 5, 4, 65];
var weggehaaldElement = getallen.shift();
getallen;
Array [ 8, 78, 5, 4, 65 ]
weggehaaldElement
102